body, html {
  margin: 0;
  padding: 0;
  height: 100%;
  width: 100%;
  overflow: hidden;
  font-family: Arial, sans-serif;
}

#sky-gradient {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  animation: skyGradient 24s linear infinite;
}

#time-display {
  position: fixed;
  top: 20px;
  left: 20px;
  color: white;
  font-size: 24px;
  text-shadow: 1px 1px 3px rgba(0,0,0,0.5);
}

@keyframes skyGradient {
  0%, 100% { background: #00000c; }
  4.17% { background: linear-gradient(to bottom, #020111 85%,#191621 100%); }
  8.33% { background: linear-gradient(to bottom, #020111 60%,#20202c 100%); }
  12.5% { background: linear-gradient(to bottom, #020111 10%,#3a3a52 100%); }
  16.67% { background: linear-gradient(to bottom, #20202c 0%,#515175 100%); }
  20.83% { background: linear-gradient(to bottom, #40405c 0%,#6f71aa 80%,#8a76ab 100%); }
  25% { background: linear-gradient(to bottom, #4a4969 0%,#7072ab 50%,#cd82a0 100%); }
  29.17% { background: linear-gradient(to bottom, #757abf 0%,#8583be 60%,#eab0d1 100%); }
  33.33% { background: linear-gradient(to bottom, #82addb 0%,#ebb2b1 100%); }
  37.5% { background: linear-gradient(to bottom, #94c5f8 1%,#a6e6ff 70%,#b1b5ea 100%); }
  41.67% { background: linear-gradient(to bottom, #b7eaff 0%,#94dfff 100%); }
  45.83% { background: linear-gradient(to bottom, #9be2fe 0%,#67d1fb 100%); }
  50% { background: linear-gradient(to bottom, #90dffe 0%,#38a3d1 100%); }
  54.17% { background: linear-gradient(to bottom, #57c1eb 0%,#246fa8 100%); }
  58.33% { background: linear-gradient(to bottom, #2d91c2 0%,#1e528e 100%); }
  62.5% { background: linear-gradient(to bottom, #2473ab 0%,#1e528e 70%,#5b7983 100%); }
  66.67% { background: linear-gradient(to bottom, #1e528e 0%,#265889 50%,#9da671 100%); }
  70.83% { background: linear-gradient(to bottom, #1e528e 0%,#728a7c 50%,#e9ce5d 100%); }
  75% { background: linear-gradient(to bottom, #154277 0%,#576e71 30%,#e1c45e 70%,#b26339 100%); }
  79.17% { background: linear-gradient(to bottom, #163C52 0%,#4F4F47 30%,#C5752D 60%,#B7490F 80%,#2F1107 100%); }
  83.33% { background: linear-gradient(to bottom, #071B26 0%,#071B26 30%,#8A3B12 80%,#240E03 100%); }
  87.5% { background: linear-gradient(to bottom, #010A10 30%,#59230B 80%,#2F1107 100%); }
  91.67% { background: linear-gradient(to bottom, #090401 50%,#4B1D06 100%); }
  95.83% { background: linear-gradient(to bottom, #00000c 80%,#150800 100%); }
}